@import "./include/normalize.less";
@content_width:1200px;
@nav_height:50px;
*{
	margin:0;
	paddding:0;
}
@keyframes nav_to_top{
	from {top:@nav_height;}
	to {top:0px;}
}
@-webkit-keyframes nav_to_top{
	from {top:@nav_height;}
	to {top:0px;}
}
@-moz-keyframes nav_to_top{
	from {top:@nav_height;}
	to {top:0px;}
}
@-o-keyframes nav_to_top{
	from {top:@nav_height;}
	to {top:0px;}
}

.nav_content{
	width: 100%;
	height: @nav_height;
	// background: #4A148C;
	// background: -webkit-gradient(linear, 0 0, 100% 100%, from(#f96),to(#ace));
	// background: -webkit-linear-gradient( left,#673AB7,#2A36B1,#AA00FF,#E040FB,#AB47BC,#4A148C,#673AB7);
	// background: -moz-linear-gradient( left,#673AB7,#2A36B1,#AA00FF,#E040FB,#AB47BC,#4A148C,#673AB7);
	// background: -o-linear-gradient( left,#673AB7,#2A36B1,#AA00FF,#E040FB,#AB47BC,#4A148C,#673AB7);
	// background: linear-gradient( left,#673AB7,#2A36B1,#AA00FF,#E040FB,#AB47BC,#4A148C,#673AB7);

	background: -webkit-linear-gradient( left,#666,#673AB7);
	background: -moz-linear-gradient( left,#666,#673AB7);
	background: -o-linear-gradient( left,#666,#673AB7);
	background: linear-gradient( left,#666,#673AB7);
	.nav{
		// width: @content_width;
		height: 100%;
		margin:0 auto;
		text-align: center;
		li{
			padding:0px 60px;
			// width: @content_width/5;
			height: 100%;
			text-align: center;
			line-height: @nav_height;
			display: inline-block;
			// float: left;
			margin-left:0;
			overflow: hidden;
			position: relative;
			a{
				color:#fff;
			}
			span{
				position: absolute;
				left:0;
				top:50px;
				width: 100%;
				height: 50px;
				background: red;
			}
			&:hover{
				span{
					background: -webkit-linear-gradient( top,#7B1FA2,#880E4F,#4A148C);
					background: -moz-linear-gradient( top,#7B1FA2,#880E4F,#4A148C);
					background: -o-linear-gradient( top,#7B1FA2,#880E4F,#4A148C);
					background: linear-gradient( top,#7B1FA2,#880E4F,#4A148C);
					-webkit-animation:nav_to_top 0.2s 1 forwards;
					-moz-animation:nav_to_top 0.2s 1 forwards;
					-o-animation:nav_to_top 0.2s 1 forwards;
					animation:nav_to_top 0.2s 1 forwards;
				}

			}

		}
	}
}
.banner{
	width: 100%;
	max-height: 360px;
	overflow: hidden;
	.big_img{
		width: 100%;
		height: 340px;
		position: relative;
		li{
			width: 100%;
			height: 340px;
			position: absolute;
			left:0;
			top:0;
			img{
				width: 100%;
			}
		}
	}
}
